<template>
<div>
  默认的count：{{count}}
   默认的double：{{state.double}}
</div>
{{refnew}}
<button @click="add">增加</button>
<button @click="changeRef()">改变ref值</button>
</template>
<script setup lang="ts">
import { computed, reactive,ref, toRefs } from 'vue';

type DState  = {
  count:number;
  double:number
}

const state :DState = reactive(
  {
    count:0,
    double:computed(()=>state.count*2)
  }
)
let refnew = ref(2)
let {count} = {...toRefs(state)}

console.log(refnew.value)

const add = ()=>{
  state.count++;
}
const changeRef =()=>{
  refnew.value +=12;
  console.log(refnew.value)
}

</script>